<template>
  <el-card shadow="never" class="header">
    <div>活动名称：{{ props.info?.activity_name }}</div>
    <div>创建人：{{ props.info?.created_user }}</div>
    <div>创建时间：{{ props.info?.created_at }}</div>

    <div v-if="props.info?.period_type == 1">有效期：永久</div>
    <div v-else class="create_date">
      创建有效期：{{ props.info?.activity_time?.[0] }} 至
      {{ props.info?.activity_time?.[1] }}
    </div>
    <div class="status">
      状态：<span :style="{ color: StatusColor(props.info?.status) }">
        {{ props.info?.status_name }}
      </span>
    </div>
    <!-- <div v-if="props.info?.actual_end_time != ''">提前结束时间：{{ props.info?.actual_end_time }}</div> -->
  </el-card>
</template>
<script setup lang="ts">
import { withDefaults, defineProps } from 'vue'
import { StatusColor } from '@/utils/smartMarketing'
const props = defineProps(['info'])
</script>
<style lang="scss" scoped>
.header {
  margin-bottom: 16px;
  :deep(.el-card__body) {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
    font-size: 14px;
  }
}
</style>
